import Image from "next/image";
import { MyMenubar } from "../client/menubar";
import { H3 } from "@/components/ui/typography";

export function Panel() {
  return (
    <div className="w-full flex justify-center">
      <div
        className="w-full lg:max-w-5xl flex items-end px-8 py-10 bg-cover bg-center"
        style={{
          backgroundImage: "url('/image/bg.png')"
        }}
      >
        <div className="flex-shrink-0">
          <Image
            src="/image/avatar/1.jpg"
            alt="avatar"
            className="object-cover rounded-md"
            width={120}
            height={120}
            sizes="100vw"
          />
        </div>
        <div className="flex flex-col justify-end ml-4">
          <H3 className="mb-2">LeeYa Master</H3>
          <MyMenubar />
        </div>
      </div>
    </div>
  );
}
